<template>
  <!-- 尾部区域 -->
  <footer class="footernull">
    <div class="fnav-box">
      <router-link to="/dpms" active-class="active"
        ><div class="fnav-01">
          <van-icon name="medal" size="0.3rem"/>
          <p class="fnav-01 footer">单品秒杀</p>
        </div></router-link
      >
      <router-link to="/plms" active-class="active"
        ><div class="fnav-01">
          <van-icon name="bookmark" size="0.3rem" />
          <p class="fnav-01 footer">品类秒杀</p>
        </div></router-link>
      <router-link to="/jrbm" active-class="active">
        <div class="fnav-01">
          <van-icon name="fire" size="0.3rem" />
          <p class="fnav-01 footer">今日必秒</p>
        </div></router-link>
    </div>
  </footer>
</template>

<script>
export default {
  name: "ypfooter",
};
</script>

<style scoped>
/* 尾部区域 */
.footernull {
  margin-top: 0.6rem;
}
footer .fnav-box {
  width: 4.14rem;
  height: 0.58rem;
  background-color: rgb(250, 250, 250);
  position: fixed;
  bottom: 0;
  box-sizing: border-box;
  padding: 0 0.15rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

footer .fnav-box .fnav-01 {
  display: flex;
  flex-direction: column;
  align-items: center;
}

footer .fnav-box .iconfont {
  font-size: 0.22rem;
  font-weight: 600;
}

footer .fnav-box .footer {
  font-size: 0.1rem;
}
footer .fnav-box .active {
  color: red;
}
</style>
